<section class="content--full">
  <p>Welcome to DBM
    <nz-tag [nzColor]="'#f50'">{{version}}</nz-tag>
  </p>
  <div nz-row nzJustify="space-around" [nzGutter]="[16, 16]">
    <div *ngFor="let datasource of dataSources; let i = index" nz-col nzSpan="12">
      <nz-card nzTitle="{{datasource.alias}}">
        <nz-result *ngIf="datasource.type !== dataSourceType.clickhosue; else supportSourceTypeTemplate"
                   nzStatus="warning" nzTitle="{{'alert.not_support_data_source_type'|translate}}">
        </nz-result>
        <ng-template #supportSourceTypeTemplate>
          <nz-skeleton *ngIf="chartsSkeleton[i]; else visibilityChart" [nzActive]="true"></nz-skeleton>
          <ng-template #visibilityChart>
            <app-component-charts-line *ngIf="chartsConfig[i]; else getAnalysisFailed" [config]="chartsConfig[i]">
            </app-component-charts-line>
            <ng-template #getAnalysisFailed>
              <nz-result nzStatus="error" nzTitle="{{'alert.get_analysis_failed'|translate}}">
              </nz-result>
            </ng-template>
          </ng-template>
        </ng-template>
      </nz-card>
    </div>
  </div>
</section>
